<template>
  <div clas="xima">
    <header>
      <ol class="breadcrumb">
        <li>
          <router-link to="/foreign">合作</router-link>
        </li>
        <li>
          <router-link to="/cooperates">合作伙伴</router-link>
        </li>
      </ol>
    </header>
    <div class="domesticContent">
      <div class="row">
        <div class="col-xs-12 col-md-8">
          <div class="table">
          <!-- 时间线开始 -->
          <div class="social">
  follow me : 
  <a href="https://codepen.io/mo7hamed/pens/public/#" target="_blank">codepen</a>
  
  <a href="https://plus.google.com/u/0/115875826373261470610" target="_blank">gmail</a>
</div>

<div class="box">
            <ul id="first-list">
                <li>
                    <span></span>
                    <div class="title">comment #01</div>
                    <div class="info">the best animation , the best toturials you would ever see .</div>
                    <div class="name">- dr. mohamed -</div>
                    <div class="time">
                        <span>JUN, 17<sup>th</sup></span>
                        <span>12:00 AM</span>
                    </div>
                </li>
                <li>
                    <span></span>
                    <div class="title">summery #01</div>
                    <div class="info">the best animation , the best toturials you would ever see here only . you can learn how to animate and how to use SVG . even else you can add your own animations .</div>
                    <div class="name">- eng. amr -</div>
                    <div class="time">
                        <span>JUN, 29<sup>th</sup></span>
                        <span>11:36 AM</span>
                    </div>
                </li>
                <li>
                    <span></span>
                    <div class="title">comment #02</div>
                    <div class="info">the best animation , the best toturials you would ever see . what about canvas ?? do you like it ..</div>
                    <div class="name">- dr. ahmed -</div>
                    <div class="time">
                        <span>FEB, 2<sup>nd</sup></span>
                        <span>02:00 PM</span>
                    </div>
                </li>
                
                <div class="arrow" id="btn1">
            
                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 284.929 284.929" style="enable-background:new 0 0 284.929 284.929;" xml:space="preserve">
                    <g>
                        <g>
                            <path d="M135.899,167.877c1.902,1.902,4.093,2.851,6.567,2.851s4.661-0.948,6.562-2.851L282.082,34.829    c1.902-1.903,2.847-4.093,2.847-6.567s-0.951-4.665-2.847-6.567L267.808,7.417c-1.902-1.903-4.093-2.853-6.57-2.853    c-2.471,0-4.661,0.95-6.563,2.853L142.466,119.622L30.262,7.417c-1.903-1.903-4.093-2.853-6.567-2.853    c-2.475,0-4.665,0.95-6.567,2.853L2.856,21.695C0.95,23.597,0,25.784,0,28.262c0,2.478,0.953,4.665,2.856,6.567L135.899,167.877z" fill="#FFFFFF"/>
                            <path d="M267.808,117.053c-1.902-1.903-4.093-2.853-6.57-2.853c-2.471,0-4.661,0.95-6.563,2.853L142.466,229.257L30.262,117.05    c-1.903-1.903-4.093-2.853-6.567-2.853c-2.475,0-4.665,0.95-6.567,2.853L2.856,131.327C0.95,133.23,0,135.42,0,137.893    c0,2.474,0.953,4.665,2.856,6.57l133.043,133.046c1.902,1.903,4.093,2.854,6.567,2.854s4.661-0.951,6.562-2.854l133.054-133.046    c1.902-1.903,2.847-4.093,2.847-6.565c0-2.474-0.951-4.661-2.847-6.567L267.808,117.053z" fill="#FFFFFF"/>
                        </g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                </svg>
                
            </div> 
            </ul>
                
               
            
            <ul id="second-list">
                <li>
                    <span></span>
                    <div class="title">comment #03</div>
                    <div class="info">the best animation , the best toturials you would ever see .</div>
                    <div class="name">- mohamed -</div>
                    <div class="time">
                        <span>MAR, 21<sup>st</sup></span>
                        <span>03:49 PM</span>
                    </div>
                </li>
                <li>
                    <span></span>
                    <div class="title">summery #02</div>
                    <div class="info">the best animation , the best toturials you would ever see here only . you can learn how to animate and how to use SVG . even else you can add your own animations .</div>
                    <div class="name">- mohamed -</div>
                    <div class="time">
                        <span>MAY, 13<sup>rd</sup></span>
                        <span>09:23 AM</span>
                    </div>
                </li>
                <li>
                    <span></span>
                    <div class="title">comment #04</div>
                    <div class="info">the best animation , the best toturials you would ever see . what about canvas ?? do you like it ..</div>
                    <div class="name">- mohamed -</div>
                    <div class="time">
                        <span>OCT, 15<sup>th</sup></span>
                        <span>08:30 PM</span>
                    </div>
                </li>
                
                <div class="arrow" id="btn2">
            
                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 284.929 284.929" style="enable-background:new 0 0 284.929 284.929;" xml:space="preserve">
                    <g>
                        <g>
                            <path d="M135.899,167.877c1.902,1.902,4.093,2.851,6.567,2.851s4.661-0.948,6.562-2.851L282.082,34.829    c1.902-1.903,2.847-4.093,2.847-6.567s-0.951-4.665-2.847-6.567L267.808,7.417c-1.902-1.903-4.093-2.853-6.57-2.853    c-2.471,0-4.661,0.95-6.563,2.853L142.466,119.622L30.262,7.417c-1.903-1.903-4.093-2.853-6.567-2.853    c-2.475,0-4.665,0.95-6.567,2.853L2.856,21.695C0.95,23.597,0,25.784,0,28.262c0,2.478,0.953,4.665,2.856,6.567L135.899,167.877z" fill="#FFFFFF"/>
                            <path d="M267.808,117.053c-1.902-1.903-4.093-2.853-6.57-2.853c-2.471,0-4.661,0.95-6.563,2.853L142.466,229.257L30.262,117.05    c-1.903-1.903-4.093-2.853-6.567-2.853c-2.475,0-4.665,0.95-6.567,2.853L2.856,131.327C0.95,133.23,0,135.42,0,137.893    c0,2.474,0.953,4.665,2.856,6.57l133.043,133.046c1.902,1.903,4.093,2.854,6.567,2.854s4.661-0.951,6.562-2.854l133.054-133.046    c1.902-1.903,2.847-4.093,2.847-6.565c0-2.474-0.951-4.661-2.847-6.567L267.808,117.053z" fill="#FFFFFF"/>
                        </g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                    <g>
                    </g>
                </svg>
                
            </div>
            </ul>
            <script src="JavaScript/timeline-V2.js"></script>
        </div>
  
          <!-- 时间线结束 -->
            <!-- <table
              class="lots"
              border="0"
              cellspacing="0"
              cellpadding="10"
              width="100%"
            >
              <tbody>
                <tr>
                  <td>
                    <img
                      class="table_img"
                      src="../assets/bjyy.jpg"
                      alt=""
                    /><br />
                    <a href="http://www.bfh.com.cn/Html/Index.html"
                      >北京友谊医院</a
                    >
                  </td>
                  <td>
                    <img src="../assets/zgzykxxw.png" alt="" /><br />
                    <a href="http://www.xyhospital.com/">
                      中国中医科学院西苑医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/pgq.jpg" alt="" /><br />
                    <a href="http://www.pgyy.com/">北京市平谷区人民医院</a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/htzx.jpg" alt="" /><br />
                    <a href="http://www.asch.net.cn/">
                      航天中心医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/xts.jpg" alt="" /><br />
                    <a href="http://www.xtshos.com.cn/">北京市小汤山医院</a>
                  </td>
                  <td>
                    <img src="../assets/zgyxky.jpg" alt="" /><br />
                    <a href="https://www.fuwaihospital.org/Hospitals/Main.htm">
                      中国医学科学院阜外医院
                    </a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/df.jpg" alt="" /><br />
                    <a href="http://www.dongfangyy.com.cn/"
                      >北京中医药大学东方医院</a
                    >
                  </td>
                  <td>
                    <img src="../assets/yxsrm.jpg" alt="" /><br />
                    <a href="http://www.yxhospital.com/">
                      玉溪市人民医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/dhz.jpg" alt="" /><br />
                    <a href="http://www.dhzyy.com/">德宏州人民医院</a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/hhzrm.jpg" alt="" /><br />
                    <a href="http://www.hhzyy.com/">
                      红河州人民医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/djxrm.jpg" alt="" /><br />
                    <a href="https://www.cjxrmyy.cn/">澄江县人民医院</a>
                  </td>
                  <td>
                    <img src="../assets/cxz.jpg" alt="" /><br />
                    <a href="http://www.cxzrmyy.com/">
                      楚雄州人民医院
                    </a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/jjsdyrm.jpg" alt="" /><br />
                    <a href="http://www.jxjjsdyrmyy.cn/">九江市第一人民医院</a>
                  </td>
                  <td>
                    <img src="../assets/jjslxq.jpg" alt="" /><br />
                    <a href="http://www.jxsjjslsqrmyy.cn/">
                      九江市濂溪区人民医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/zsdxfs.jpg" alt="" /><br />
                    <a href="http://gzsums.net/">中山大学附属第一医院</a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/gdsz.jpg" alt="" /><br />
                    <a href="http://www.gdhtcm.com/">
                      广东省中医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/zyyzh.jpg" alt="" /><br />
                    <a href="http://www.gdhtcm.com/">广东省中医院珠海医院</a>
                  </td>
                  <td>
                    <img src="../assets/fssdy.jpg" alt="" /><br />
                    <a href="https://www.fsyyy.com/">
                      佛山市第一人民医院
                    </a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/bdszx.jpg" alt="" /><br />
                    <a href="http://www.bddhospital.com.cn/">保定市中心医院</a>
                  </td>
                  <td>
                    <img src="../assets/hbbf.jpg" alt="" /><br />
                    <a href="http://www.bfefy.com/">
                      河北北方学院附属第二医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/my.jpg" alt="" /><br />
                    <a href="http://www.myzxyy.com/">绵阳市中心医院</a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/sysrm.jpg" alt="" /><br />
                    <a href="http://www.syhospital.com/">
                      三亚市人民医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/tysrm.jpg" alt="" /><br />
                    <a href="http://www.tysrmyy.cn/">太原市人民医院</a>
                  </td>
                  <td>
                    <img src="../assets/tydsrm.jpg" alt="" /><br />
                    <a href="">
                      太原市第四人民医院
                    </a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/xyszx.jpg" alt="" /><br />
                    <a href="http://www.xy120.net/">咸阳市中心医院</a>
                  </td>
                  <td>
                    <img src="../assets/bjszx.jpg" alt="" /><br />
                    <a href="http://www.bjzxyy.com/index.php">
                      宝鸡市中心医院
                    </a>
                  </td>
                  <td>
                    <img src="../assets/akszx.jpg" alt="" /><br />
                    <a href="http://www.akzxyy.com/#/home">安康市中心医院</a>
                  </td>
                </tr>
                <tr>
                  <td>
                    <img src="../assets/sys.jpg" alt="" /><br />
                    <a href="http://www.sy24.cn/shenyang/yiyuan/8808.html">
                      中国医科大学附属第一医院
                    </a>
                  </td>
                </tr>
              </tbody>
            </table> -->
          </div>
        </div>
         <div class="col-xs-6 col-md-4">
          <div class="guide">
            <div class="guideTop">
              <ul>
                <li>
                  <router-link to="/foreign"><span>德国合作</span></router-link>
                </li>
                <hr>
                <li>
                  <router-link to="/domestic">国内合作</router-link>
                </li>
                 <hr>
                <li>
                  <router-link to="/domestic">合作伙伴</router-link>
                </li>
              </ul>
            </div>
            <div class="guideTip">
              <p class="connect_h">联系我们</p>
              <hr
                style="border-top: 1px solid #ccc"
                width="100%"
                color="#ccc"
                size="1"
              />
                <img src="../assets/code.jpg" alt="" />
              <div><span>电话：861068005755,861068006083</span></div>
              <div><span>Email: xmbj2005@163.com</span></div>
              <div><span>邮箱: 492800904@qq.com</span></div>
              <div>
                <span>地址: 北京市西城区西直门外大街18号金贸大厦A座935</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<style></style>
    .table {
        width: 100%;
    }
    
    .table table tr td img {
        width: 6.25rem/* 100/16 */
        ;
        height: 6.25rem/* 100/16 */
        ;
    }
    
    .table table tr td a {
        font-size: 1px;
    }
 /* 右边内容开始 */
  .guide {
  width: 220%;
}
.guideTop {
  width:100%;
  background-color:#005051;;
  box-sizing: border-box;
}

.guideTop ul {
  list-style-type: none;
  box-sizing:border-box;
}
.guideTop ul li{
  padding:.625rem /* 10/16 */;
}
.guideTop ul hr {
  padding-left:20px;
  padding-right:20px;
  border:.0625rem /* 1/16 */ solid #fff;
  margin:0;
}

.guideTop ul li a {
  padding:.625rem /* 10/16 */;
  color: #fff;
  font-size: 16px;
}
.guideTip{
  margin-top:1.25rem /* 20/16 */;
}
.guideTip .connect_h {
  font-size: 28px;
  text-indent: 0;
  margin-bottom:1.875rem /* 30/16 */;
}
.guideTip hr{
  margin:0;
  padding:0;
}

.guideTip div {
  white-space: nowrap;
  margin:1.25rem /* 20/16 */ 0;
}

.guideTip div span {
  word-break: break-all;
}
  /* 右边内容结束 */
    @media screen and (min-width: 992px) {
        
         /* 右边内容开始 */
  .guideTop {
    background-color: #f8f8f8;
    margin-bottom: 1.875rem /* 30/16 */;
  }
  .guideTop ul {
    margin: 0;
    padding-bottom: 0;
    list-style-type: none;
    box-sizing: border-box;
  }
  .guideTop ul hr {
    padding: 0;
    margin: 0;
    height: 2px;
    margin: 0;
  }
  .guideTop ul li {
    margin-left: 0;
    padding-bottom: 0;
    list-style-type: none;
    padding: 0;
  }
  .guideTop ul li a {
    padding: 1.25rem /* 20/16 */;
    position: relative;
    color: #fff;
    background-color: #005051;
    font-weight: 600;
    display: block;
  }
  .guideTip .connect_h {
    font-size: 28px;
    text-indent: 0;
  }

  .guideTip div {
    height: 30px;
  }
  .guideTip hr {
    margin: 0 0 1.875rem /* 30/16 */;
    padding: 0;
  }
  .guideTip img {
    display: inline;
    border: 1px solid #ccc;
    margin-bottom: 1.875rem /* 30/16 */;
  }
  .guideTip p {
    text-align: left;
  }
  .guideTop div span {
    word-break: break-all;
    word-wrap: break-word;
  }
  /* 右边内容结束 */
    }
</style>